<!DOCTYPE html>
<html lang="zh-cn">
<head>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <meta name="keywords" content="博客,技术,PHP,Mysql,Html,Css,Ajax,服务器,Js,数据库,网站,微信公众号,小程序" />
    <meta name="description" content="Alinejun - 个人技术博客，专注码农的世界" />
    <title>Alinejun - 个人技术博客</title>
    <link rel="icon" href="__IMG__/favicon.ico">
    <link href="__STATIC__/bootstrap/css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="__STATIC__/bootstrap/css/bootstrap-theme.min.css" rel="stylesheet" type="text/css" />
    <link href="__CSS__/head.css" rel="stylesheet" type="text/css" />
    <link href="__CSS__/base.css" rel="stylesheet" type="text/css" />
    <link href="__CSS__/index.css" rel="stylesheet" type="text/css" />
    <link href="__CSS__/iconfont.css" rel="stylesheet" type="text/css" />
    

</head>
<body>
    <!-- head -->
    <div class="container-fluid" style="padding: 0px">
        <div class="header">
            <!-- header -->
            {:widget('Common/header')}
            <!-- /header -->

            <!-- category -->
            {:widget('Common/category')}
            <!-- /category -->
        </div>
    </div>
    <!-- head -->

	<!-- itemGrid for hot -->
    <div class="container">
        <div class="row">
            <div class="col-sm-8 col-md-9 box-left">

                <!-- itemBox 头条 -->
                <div class="main-login cont-box" style="padding:0px 20px;margin: 0px;">
                    <div class="title">
                        <h1>欢迎 / Welcome</h1>
                        <p>业精于勤，荒于嬉；行出成于出，毁于随</p>
                    </div>                   
                    <div class="line"></div>

                    <div class="box-login">
                        <div class="col-md-6 col-md-offset-3 login-group">
                            <div class="form-toogle">
                                <h3>
                                    <a href="javascript:;" class="active" id="login">登录</a>
                                    <a href="javascript:;" id="regist">注册</a>
                                </h3>
                            </div>

                            <form action="" class="form-login">
                                <div class="form-group">
                                    <label for="exampleInputEmail1">用户名</label>
                                    <input type="text" name="username" class="form-control" onkeyup="this.value=this.value.replace(/[^0-9a-zA-Z_]/g,'')" onpaste="this.value=this.value.replace(/[^0-9a-zA-Z_]/g,'')" placeholder="请输入用户名">
                                </div>
                                <div class="form-group">
                                    <label for="exampleInputPassword1">密码</label>
                                    <input type="password" name="password" class="form-control"  placeholder="密码">
                                </div>
                                <div class="form-group text-center">
                                    <a class="btn btn-success sub">登录</a>
                                </div>
                            </form>

                            <form action="" class="form-regist">
                                
                                <div class="form-group">
                                    <label for="exampleInputEmail1">昵称</label>
                                    <input type="text" name="nickname" class="form-control" placeholder="请输入昵称">
                                </div>
                                <div class="form-group">
                                    <label for="exampleInputEmail1">用户名</label>
                                    <input type="text" name="username" class="form-control username" onkeyup="this.value=this.value.replace(/[^0-9a-zA-Z_]/g,'')" onpaste="this.value=this.value.replace(/[^0-9a-zA-Z_]/g,'')" placeholder="请输入用户名">
                                    <p class="help-block">请输入至少5位字母+数字+下划线组合字符串</p>
                                </div>
                                <div class="form-group">
                                    <label for="exampleInputPassword1">密码</label>
                                    <input type="password" name="password" class="form-control password"  placeholder="密码">
                                    <p class="help-block">请输入字母+数字+下划线组合字符串</p>
                                </div>

                                <div class="form-group">
                                    <label for="exampleInputPassword1">确认密码</label>
                                    <input type="password" name="repassword" class="form-control" placeholder="确认密码">
                                </div>

                                <div class="form-group text-center">
                                    <a class="btn btn-success sub">提交</a>
                                </div>
                            </form>
                        </div>
                    </div>

                </div>                    
                <!-- itemBox 头条 -->
            </div>
            <div class="col-sm-4 col-md-3 box-right">
                <!-- news -->
                {:widget('Common/news')}
                <!-- /news -->

                <!-- labels -->
                {:widget('Common/labels')}
                <!-- /labels -->
                   
            </div>

            <div class="clearfix"></div>
        </div>
    </div>

    <!-- footer -->
    {:widget('Common/footer')}
    <!-- /footer -->
    
    <script type="text/javascript" src="__JS__/jquery-2.1.4.min.js"></script>
    <script type="text/javascript" src="__STATIC__/bootstrap/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="__JS__/jquery.ripples.js"></script>
    <script type="text/javascript" src="__JS__/base.js"></script>
    <script type="text/javascript" src="__STATIC__/layer/layer.js"></script>

    <script>

        $(function(){

            // Enter 按键绑定
            $(document).keyup(function(event){
                var i = $(".form-toogle .active").index();
                if(event.keyCode ==13){
                    if (i == 1) {
                        $(".form-regist .sub").trigger("click");
                    }else{
                        $(".form-login .sub").trigger("click");
                    }
                }
            });

            // 切换
            $(".form-toogle a").click(function(){
                var i = $(this).index();
                $(".form-toogle a").removeClass("active");
                $(this).addClass("active");
                $(".box-login form").hide();
                $(".box-login form").eq(i).show();

            })

            // 提示
            $(".form-regist .username,.form-regist .password").bind('focus',function(){
                $(this).siblings(".help-block").show();
            })
            $(".form-regist .username,.form-regist .password").bind('blur',function(){
                $(this).siblings(".help-block").hide();
            })

            // 注册
            $(".form-regist .sub").click(function(){
                $.ajax({
                    url:'/index/login/regist',
                    data:$(".form-regist").serialize(),
                    type:'post',
                    dataType:'json',
                    success:function(data){
                        if (data.status == -1) {
                            layer.msg(data.msg);
                        }else{
                            layer.alert(data.msg, function(){
                                location.reload();
                            });
                        }
                    }
                })
            })

            // 登录
            $(".form-login .sub").click(function(){
                $.ajax({
                    url:'/index/login/login',
                    data:$(".form-login").serialize(),
                    type:'post',
                    dataType:'json',
                    success:function(data){
                        if (data.status == -1) {
                            layer.msg(data.msg);
                        }else{
                            layer.alert(data.msg, function(){
                                location.href="/index/index/index";
                            });
                        }
                    }
                })
            })
        })
    </script>    
</body>
</html>